<template>
  <Viewer :data="viewerData" :attachMents="attachMents" :fileParam="fileParam" v-if="showViewer" @childInitViewer="initViewerParent" :style="{height:viewerHeight+'px','margin-top':viewerTop+'px'}"></Viewer>
</template>
<script>
import Viewer from './ykd-viewer.vue'
export default {
  components: {
    Viewer
  },
  data () {
    return {
      viewerHeight: 0,
      viewerTop: 0,
      showViewer: false,
      viewerData: null
    }
  },
  props: {
    data: Array,
    attachMents: Array,
    fileParam: Object,
    isScroll: Boolean
  },
  watch: {
    data: {
      handler (newV, oldV) {
        this.showViewer = false
        this.viewerData = newV
        this.init()
      }
    }
  },
  methods: {
    /**
     * 初始化影像监听事件
     */
    initViewerEvents () {
      window.removeEventListener('scroll', this.scrollEvent)
      window.addEventListener('scroll', this.scrollEvent, true)
    },
    scrollEvent (e) {
      var vm = this
      var _e = e
      setTimeout(function () {
        vm.viewerTop = _e.target.scrollTop
      }, 100)
    },
    /**
     * 初始化组件
     */
    init () {
      if (this.isScroll) {
        this.initViewerEvents()
      }
      // 附件影像高度自动适配屏幕高度
      this.viewerHeight = window.innerHeight - 150
      this.showViewer = true
    },
    // 调用父组件的初始化影像方法
    initViewerParent () {
      var vm = this
      vm.$emit('initViewer', null)
    }
  },
  created () {

  },
  destroyed () {
    window.removeEventListener('scroll', this.scrollEvent)
  }
}
</script>
